import 'package:car_map/page/res/gaps.dart';
import 'package:car_map/page/squarepage/coffee_shop_page/widget_coffee_swiper.dart';
import 'package:car_map/widget/load_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

///美食
class FoodPage extends StatefulWidget {
  @override
  _foodState createState() => _foodState();
}

class _foodState extends State<FoodPage> with SingleTickerProviderStateMixin {
  TabController _tabController;
  List<Tab> tabList = [
    Tab(
      text: '热门',
    ),
    Tab(
      text: '食谱',
    ),
  ];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _tabController = new TabController(length: tabList.length, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.orange,
        leading: InkWell(
          child: Icon(
            Icons.add_location,
            size: 25.0,
          ),
        ),
        title: Text('美食'),
        centerTitle: true,
        actions: <Widget>[
          Container(
            margin: EdgeInsets.only(right: 10.0),
            child: Icon(
              Icons.chat,
              size: 25.0,
            ),
          )
        ],
      ),
      body: Container(
          color: Colors.white,
          padding: EdgeInsets.all(10.0),
          child: SingleChildScrollView(
            child: Column(
              children: <Widget>[
                WidgetCoffeeSwiper(
                  pathUrl:
                      'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1574243247715&di=136a91826ab5f26d8a68a80503482f63&imgtype=0&src=http%3A%2F%2Fszb.xnnews.com.cn%2Fsyxw%2FZdfjbh%2F39%2Fxxfl%2Fhk91%2Fcustomer%2F18147%2FAPeN7I7x1Nq22A2IaLG5M9NAttc2t09FhfO6BjOU.jpeg',
                ),
                columnWidget(),
              Gaps.vGap10,
             ListView.builder(itemBuilder: (context,index){
               return  foodItem();
             },itemCount: 8,shrinkWrap: true,physics: new NeverScrollableScrollPhysics(),)
//              tabTitle(),
//              Container(
//                child: TabBarView(
//                  children: <Widget>[
//                   Text('das'),
//                    Text('123'),],
//                  controller: _tabController,
//                ),
//              )
              ],
            ),
          )),
    );
  }

  //分类栏目
  Widget columnWidget() {
    return Container(
      alignment: Alignment.center,
      height: ScreenUtil().setHeight(150.0),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: <Widget>[
          columnItmeWidget(title: '视频', pathUrl: 'square/ic_video'),
          columnItmeWidget(title: '直播', pathUrl: 'square/ic_live'),
          columnItmeWidget(title: '爱的料理', pathUrl: 'square/ic_balloon'),
          columnItmeWidget(title: '智能组菜', pathUrl: 'square/ic_pot'),
        ],
      ),
    );
  }

  Widget columnItmeWidget({String title, String pathUrl}) {
    return Container(
      padding: EdgeInsets.all(5.0),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          LoadAssetImage(
            pathUrl,
            height: ScreenUtil().setHeight(60.0),
            width: ScreenUtil().setWidth(60.0),
          ),
          Gaps.vGap5,
          Text(
            title,
            style: TextStyle(fontSize: ScreenUtil().setSp(22.0)),
          )
        ],
      ),
    );
  }

  //tab Item
  Widget tabTitle() {
    return Container(
      height: ScreenUtil().setHeight(60.0),
      child: TabBar(
        tabs: tabList,
        controller: _tabController,
      ),
    );
  }

  //美食item
  Widget foodItem() {
    return Container(
      decoration: BoxDecoration(
        border: Border(bottom: BorderSide(color: Colors.black12,width: 0.5))
      ),
      margin: EdgeInsets.only(bottom: 20.0),
      width: ScreenUtil().setWidth(730.0),
      height: ScreenUtil().setHeight(400.0),
      child: Stack(
        children: <Widget>[
          LoadImage(
            'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1574246243151&di=f8fed819084c0bc81f45041c2ebd0fc6&imgtype=0&src=http%3A%2F%2Fimg3.redocn.com%2Ftupian%2F20141113%2Fjiucaichaohexiameishi_3443883.jpg',
            height: ScreenUtil().setHeight(400.0),
            fit: BoxFit.fill,
            width: ScreenUtil().setWidth(730.0),
          ),
          Positioned(
              bottom: 0,
              child: Container(
                decoration: BoxDecoration(
                    color: Colors.white,
                    border: Border(left: BorderSide(color: Colors.black12,width: 0.5)),
                ),
                height: ScreenUtil().setHeight(130.0),
                padding: EdgeInsets.only(right: 10.0,left: 10.0),
                width: ScreenUtil().setWidth(730.0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.spaceAround,
                  children: <Widget>[
                    Text(
                      '营养午餐',
                      style: TextStyle(
                          fontWeight: FontWeight.bold,
                          fontSize: ScreenUtil().setSp(30.0)),
                    ),
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: <Widget>[
                        Row(
                          children: <Widget>[
                            Text(
                              '6581',
                              style: TextStyle(
                                  color: Colors.black38,
                                  fontSize: ScreenUtil().setSp(24.0)),
                            ),
                            Gaps.hGap5,
                            Icon(
                              Icons.remove_red_eye,
                              size: 18.0,
                              color: Colors.black38,
                            ),
                            Gaps.hGap5,
                            Text('43',
                                style: TextStyle(
                                    color: Colors.black38,
                                    fontSize: ScreenUtil().setSp(24.0))),
                            Gaps.hGap5,
                            LoadAssetImage(
                              'square/ic_heart',
                              height: ScreenUtil().setHeight(25.0),
                              width: ScreenUtil().setWidth(25.0),
                            )
                          ],
                        ),
                        Text('美食小编',
                            style: TextStyle(
                                color: Colors.black38,
                                fontSize: ScreenUtil().setSp(26.0))),
                      ],
                    )
                  ],
                ),
              )),
          Positioned(
            right: ScreenUtil().setWidth(10.0),
            bottom: ScreenUtil().setHeight(80.0),
            child: ClipOval(
              child: LoadImage(
                'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=3974834430,2578081919&fm=26&gp=0.jpg',
                height: ScreenUtil().setHeight(100.0),
                fit: BoxFit.fill,
                width: ScreenUtil().setWidth(100.0),
              ),
            ),
          )
        ],
      ),
    );
  }
}
